﻿
<!--
https://github.com/netnr
https://gitee.com/netnr
https://www.netnr.com
https://zme.ink
-->


<!DOCTYPE html>
<html>
<head>

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <link rel='shortcut icon' href='/favicon.ico' type='image/x-icon' />


    <title>体重标准 脚本服务</title>

    <meta name="keywords" content="netnr NET牛人 体重标准" />
    <meta name="description" content="Script Services 中国成人超重和肥胖标准" />

</head>
<body>
<div id='LoadingMask' style='position:fixed;top:0;left:0;bottom:0;right:0;background-color:white;z-index:19999;background-image:url('/images/loading.svg');background-repeat:no-repeat;background-position:48% 45%'></div>
<link href='https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css' rel='stylesheet'>
<link href='https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css' rel='stylesheet'>
<script src='https://cdn.jsdelivr.net/npm/jquery@3.5.0/dist/jquery.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/jzjs@2.0.2/2.0.2/jz.min.js'></script>
<link href='https://cdn.jsdelivr.net/npm/netnrnav@1.1.0/src/netnrnav.css' rel='stylesheet' />
<script src='https://cdn.jsdelivr.net/npm/netnrnav@1.1.0/src/netnrnav.js' defer async></script>

<script>
    $.ajax({
        url: '/images/icon.svg?20201228',
        dataType: 'text',
        success: function (data) {
            $('body').append('<div class="d-none">' + data + '</div>')
        }
    })
</script>

        <link href="/css/global.css?v=YuzFOH_Z7ma5bs-3HMdZQu0aPQZ1pkBqrzQ_Ri8Yh3k" rel="stylesheet" />
        <script src="/js/global.js?v=ckkNo3hER74SKnNCuouMgEfxEpEMP3phtPl9uA0_Lnc"></script>
            <!--导航-->
            <button type="button" class="MenuToggle show-in-mobile btn btn-primary ml-3 mt-3">
                <span class="fa fa-align-justify fa-2x"></span>
            </button>
            <div class="netnrnav horizontal">
                <div class="netnrnav-wrapper">
                    <ul>
                        <li><a href="https://www.netnr.com" class="siteIcon"><img src="/favicon.svg" /> 首页</a></li>
                        <li><a href="https://www.netnr.com/gist/discover" title="代码片段"><span class="fa fa-fw fa-file-code-o"></span> Gist</a></li>
                        <li><a href="https://www.netnr.com/run/discover" title="在线运行代码"><span class="fa fa-fw fa-play"></span> Run</a></li>
                        <li><a href="https://www.netnr.com/doc" title="文档管理"><span class="fa fa-fw fa-book"></span> Doc</a></li>
                        <li><a href="https://www.netnr.com/draw/discover" title="绘制"><span class="fa fa-fw fa-paint-brush"></span> Draw</a></li>
                        <li><a href="/" title="ss.js.org"><span class="fa fa-fw fa-wrench"></span> 服务</a></li>
                        <li style="background-image: radial-gradient(ellipse, white, rgb(227, 248, 240))">
                            <!--标题-->
                                <a href='javascript:location.reload(false)' title="中国成人超重和肥胖标准">
                                    <svg class="titleicon"><use xlink:href="#bmi"></use></svg> &#x4F53;&#x91CD;&#x6807;&#x51C6;
                                </a>
                        </li>
                        <li>
                            <a class="text-muted"><span class="fa fa-fw fa-ellipsis-h"></span></a>
                            <ul>
                                <li><a target="_blank" title="码云" href="https://gitee.com/netnr"><i class="fa fa-fw fa-git"></i> Gitee <sup><i class="fa small fa-external-link"></i></sup></a></li>
                                <li><a target="_blank" title="GitHub" href="https://github.com/netnr"><i class="fa fa-fw fa-github"></i> GitHub <sup><i class="fa small fa-external-link"></i></sup></a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        <div class="min300 mt-3">
            <style>
    .progress {
        height: 2rem;
    }
</style>

<div class="container-fluid">
    <div class="row">
        <div class="col-md mb-3">
            <div class="input-group input-group-lg">
                <div class="input-group-prepend">
                    <span class="input-group-text">体重</span>
                </div>
                <input type="number" id="txt1" class="form-control" placeholder="体重（单位：千克/kg）" min="25" max="300" step="1" maxlength="3" />
            </div>
        </div>
        <div class="col-md mb-3">
            <div class="input-group input-group-lg">
                <div class="input-group-prepend">
                    <span class="input-group-text">身高</span>
                </div>
                <input type="number" id="txt2" class="form-control" placeholder="身高（单位：米/m）" min="1" max="3" step="0.1" maxlength="4" />
            </div>
        </div>
        <div class="col-md mb-3">
            <div class="input-group input-group-lg">
                <div class="input-group-prepend">
                    <span class="input-group-text">BMI</span>
                </div>
                <input type="text" id="txt3" class="form-control" readonly placeholder="输出 BMI 值" />
            </div>
        </div>
    </div>

    <div class="row my-3">
        <div class="col-md">
            <div class="progress">
                <div class="progress-bar bg-dark" title="低重：BMI < 18.5" style="width: 100%">低重：BMI < 18.5</div>
            </div>
        </div>
        <div class="col-md">
            <div class="progress">
                <div class="progress-bar bg-success" title="正常：18.5 ≤ BMI < 24.0" style="width: 100%">正常：18.5 ≤ BMI < 24.0</div>
            </div>
        </div>
        <div class="col-md">
            <div class="progress">
                <div class="progress-bar bg-warning" title="超重：24.0 ≤ BMI < 28.0" style="width: 100%">超重：24.0 ≤ BMI < 28.0</div>
            </div>
        </div>
        <div class="col-md">
            <div class="progress">
                <div class="progress-bar bg-danger" title="肥胖：BMI ≥ 28.0" style="width: 100%">肥胖：BMI ≥ 28.0</div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <p>计算公式： BMI = 体重(KG) ÷ 身高²(M)</p>
            <p>比如：小M是一个60公斤的人，身高是1.7米，则他的计算结果应该是：60÷1.7² =20.76</p>
            <p>一个人的健康指数范围应该是在：18.5～24，指数在这之间是最好最正常的！</p>
        </div>
    </div>
</div>

<script>

    var ids = ['txt1', 'txt2'];
    for (var i = 0; i < ids.length; i++) {
        var id = ids[i];
        document.getElementById(id).oninput = function () {
            var kg = document.getElementById('txt1').value,
                m = document.getElementById('txt2').value;
            kg = parseFloat(kg) || 0;
            m = parseFloat(m) || 0;
            var bmi = '', bgc = '';
            if (kg && m) {
                bmi = (kg / Math.pow(m, 2)).toFixed(2);
                if (bmi >= 28) {
                    bgc = 'danger';
                }
                if (bmi < 28) {
                    bgc = 'warning';
                }
                if (bmi < 24) {
                    bgc = 'success';
                }
                if (bmi < 18.5) {
                    bgc = 'dark';
                }
                bgc = 'text-white bg-' + bgc;
            }
            var t3 = document.getElementById('txt3');
            t3.value = bmi;
            t3.className = 'form-control ' + bgc;
        }
    }
</script>
        </div>
        <a href="javascript:ss.toTop();" class="totop" title="返回顶部">ˆ</a>
</body>
</html>
